import { queryDocKeyWordErrorList } from "@/api/sysuser";
import { type PaginationProps } from "@pureadmin/table";
import { FormItemProps } from "./types";
import { ref, onMounted, reactive } from "vue";

export function useForm() {
  const taskRef = ref();

  function setFormInlineToTsx(data?: FormItemProps) {
    taskRef.value = data;
  }

  const dataList = ref([]);
  const dataLoading = ref(true);

  const pagination = reactive<PaginationProps>({
    total: 0,
    pageSize: 10,
    currentPage: 1,
    background: true
  });

  const columns: TableColumnList = [
    {
      label: "错情内容",
      prop: "keyword",
      minWidth: 100
    },
    {
      label: "错情原因",
      prop: "remark",
      minWidth: 200
    }
  ];

  async function onSearch() {
    queryDocKeyWordErrorList({
      fileid: taskRef.value.id,
      pageSize: pagination.pageSize,
      currentPage: pagination.currentPage
    }).then(res => {
      if (res.success) {
        console.log(JSON.stringify(res));
        dataList.value = res.data.list;
        pagination.total = res.data.total;
        dataLoading.value = false;
      }
    });
  }

  function handleSizeChange(val: number) {
    console.log(`${val} items per page`);
  }

  function handleCurrentChange(val: number) {
    console.log(`current page: ${val}`);
    onSearch();
  }

  function handleSelectionChange(val) {
    console.log("handleSelectionChange", val);
  }

  onMounted(() => {
    onSearch();
  });

  return {
    setFormInlineToTsx,
    dataLoading,
    columns,
    dataList,
    pagination,
    onSearch,
    handleSizeChange,
    handleCurrentChange,
    handleSelectionChange
  };
}
